<template>
  <view class="styleGuideHall">
    <!-- <toast></toast> -->
    <!-- <u-navbar title="财务中心" :bgColor="navbarClass.titleBgColor" @leftClick="backHome" :placeholder="true"> </u-navbar> -->
    <image class="image1" src="../../static/image/guideHall1.png" mode="" />
    <view class="tabList">
      <image class="image2" @click="gotoJump('/pageContent/guide/guideDetails?type=1')" src="../../static/image/guideHall2.png" mode="" />
      <image class="image2" @click="gotoJump('/pageContent/guide/guideDetails?type=2')" src="../../static/image/guideHall3.png" mode="" />
      <image class="image2" @click="gotoJump('/pageContent/guide/guideDetails?type=3')" src="../../static/image/guideHall4.png" mode="" />
      <image class="image2" @click="gotoJump('/pageContent/guide/guideDetails?type=4')" src="../../static/image/guideHall5.png" mode="" />
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {}
  },
  onLoad() {},
  methods: {
    gotoJump(url) {
      uni.navigateTo({
        url: url,
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.styleGuideHall {
  background: #f6f6f6;
  min-height: 100vh;
  .image1 {
    width: 100%;
    height: 182rpx;
  }
  .tabList {
    background: #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 24rpx 32rpx 10rpx;
    .image2 {
      width: 330rpx;
      height: 142rpx;
      margin-bottom: 24rpx;
    }
  }
}
</style>
